#{$css-scope} {
  .headline, .title1 {
    font-size: round(2.2 * $base-font-size);
    font-weight: 100;
    letter-spacing: 1px;
  }

  .title2 {
    font-size: round(1.7 * $base-font-size);
    font-weight: 400;
  }

  .title3 {
    font-size: round(1.4 * $base-font-size);
    font-weight: 400;
  }

  .title4 {
    font-size: round(1.25 * $base-font-size);
    font-weight: 400;
  }

  .title5 {
    font-size: round(1.1 * $base-font-size);
    font-weight: 600;
  }

  .body {
    font-size: $base-font-size;
    font-weight: normal;
  }

  .caption {
    font-size: round(0.85 * $base-font-size);
    font-style: italic;
    color: $caption-color;
  }

  .text-upper {text-transform: uppercase;}
  .text-lower {text-transform: lowercase;}
  .text-capitalize {text-transform: capitalize;}
  .text-light {font-weight: normal;}
  .text-bold {font-weight: bold;}
  .text-italic {font-style: italic;}
  .text-nowrap {white-space: nowrap;}
}
